<template>
  <div class=''>HomeIndex
    <div>
      <my-cover v-model="imgSrc"></my-cover>
    </div>
    <!-- 使用MyChannels组件的时候需要拿根组件el-form包起来 -->
    <el-form>
      <!-- 子传父
      1.在父组件中自定义事件，监听子组件,@transmit="hTransmitChannelId"
      2.当用户在下拉列表中进行选择时，抛出事件, 子组件this.$emit('transmit', val);-->
      <my-channels @transmit="hTransmit"></my-channels>
      <!-- 在父组件中直接用v-model绑定数据项 -->
      <my-channels-vmodel v-model="channel_id_vmodel"></my-channels-vmodel>
    </el-form>
  </div>
</template>

<script>
import MyCover from '@/components/MyCover.vue';
import MyChannels from '@/components/MyChannels.vue';
import MyChannelsVmodel from '@/components/MyChannelsVmodel.vue';
export default {
  name: 'HomeIndex',
  props: { },
  data () {
    return {
      // v-model="imgSrc"
      imgSrc: '',
      channel_id: '', // 这个数据项的值需要从子组件MyChannels拿到
      channel_id_vmodel: '' // 用v-model实现子传父
    };
  },
  components: {
    MyChannels,
    MyChannelsVmodel,
    MyCover
  },
  computed: { },
  created () { },
  mounted () { },
  methods: {
    hTransmit (value) {
      console.log('父组件自定义事件transmit并接收子组件传来的参数', value);
      this.channel_id = value;
    }
  }
};
</script>

<style scoped lang='less'></style>
